import { CustomTable, ProTableValue } from '@/components/ProTable/interface';
import { useColumnsDataGrid } from './use-columnsDataGrid';
import { useBtnDataGrid } from './use-btnDataGrid';
import { useAddBtnForm } from './form/addBtnForm';

export function useDataGrid() {
  let dataGrid = reactive<CustomTable>({
    pagination: true,
    // 表格配置项
    columns: [{ prop: 'operation', label: 'operation', width: 200, fixed: 'left' }],
    headButtonList: [],
    rowButtonList: []
  });
  const { columnsDataGrid, addColumnsForm, saveAddColumnsForm } = useColumnsDataGrid(dataGrid);
  const { addBtnForm, saveAddBtnForm, openAddBtnForm } = useAddBtnForm(dataGrid);

  const { btnDataGrid: headDataGrid } = useBtnDataGrid(dataGrid, 'head', openAddBtnForm);
  const { btnDataGrid: rowDataGrid } = useBtnDataGrid(dataGrid, 'row', openAddBtnForm);

  return {
    dataGrid,
    columnsDataGrid,
    addColumnsForm,
    saveAddColumnsForm,
    headDataGrid,
    addBtnForm,
    saveAddBtnForm,
    rowDataGrid
  };
}
